<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- zTreeStyle.css -->
<link rel="stylesheet" type="text/css" href="${basePath}/css/zTreeStyle/zTreeStyle/zTreeStyle.css">
<!doctype html>
<html>
<head>
	<style type="text/css">
	   .gray-bg
	   {
	     background-color: #fff;
	   }
	</style>
</head>
<body class="gray-bg">
	 <div class="ibox-content">
		<form class="form-horizontal m-t" id="commentForm">
			<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%" class="tablefont">
				<tr>
					<td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">权限父节点：</label>
						</div>
					</td>
					<td  width="77%">
						<div class="form-group">		
		    				<div class="col-sm-8">
		    					<input id="id" name="id" type="hidden">
		    					<input id="parentId" name="parentId" type="hidden">
		    					<input id="parentName" name="parentName"  type="text" class="form-control smalliconcur smallicon" onclick="parentNamecho()" readonly="readonly"  aria-required="true" >
		    				</div>
		    			</div>	
					</td>
				</tr>	
			
				<tr>
					<td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">权限名称：</label>
						</div>
					</td>
					<td  width="77%">
						<div class="form-group">		
		    				<div class="col-sm-8">
		    					<input id="name" name="name" minlength="1" maxlength="64" type="text" class="form-control" required="" aria-required="true" placeholder="请输入权限名称(必填)" >
		    				</div>
		    			</div>	
					</td>
				</tr>	
				
				<tr>
					<td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">菜单排序：</label>
						</div>
					</td>
					<td  width="77%">
						<div class="form-group">		
		    				<div class="col-sm-8">
		    					<input id="sortValue" name="sortValue" minlength="1" min="1" maxlength="11" type="number" class="form-control" required="required" placeholder="菜单排序(必填)" >
		    				</div>
		    			</div>	
					</td>
				</tr>
				
				<tr>
				    <td width="23%" align="right">
				    	<label class="col-sm-3 control-label np">图标：<a href="http://www.yeahzan.com/fa/facss.html"  style="color:#FC1515;" target="_blank">图库</a></label>
				    </td>
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="icon" name="icon"  type="text" class="form-control" minlength="1" maxlength="50" placeholder="点击左侧图库，例如：fa fa-child">
		    				</div>
	    				</div>
					</td>
				</tr>
				
				<tr>
				    <td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">是否是菜单：</label>
						</div>
					</td>
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<select class="select-control" id="menuStatus" name="menuStatus">
		    						<option value="1">是</option>
		    						<option value="2">否</option>
		    					</select>
		    				</div>
	    				</div>
					</td>					
				</tr>
				
				
				<tr>
					<td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">是否快捷方式：</label>
						</div>
					</td>
					
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<select class="select-control" id="quick" name="quick">
		    						<option value="1">是</option>
		    						<option value="2">否</option>
		    					</select>
		    				</div>
	    				</div>
					</td>		
				</tr>
				
				<tr>
					<td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">权限编码：</label>
						</div>
					</td>
					
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="powerCode" name="powerCode"  type="text" class="form-control" aria-required="true" readonly="readonly" placeholder="请输入权限编码(必填)"/>
		    				</div>
	    				</div>
					</td>		
				</tr>

				
				<tr>
				    <td width="23%" align="right">
				    	<label class="col-sm-3 control-label np">链接地址：</label>
				    </td>
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<input id="href" name="href" type="text" class="form-control" minlength="1" maxlength="128" placeholder="请输入链接地址(选填)">
		    				</div>
	    				</div>
					</td>
				</tr>
				
				<tr>
					<td width="23%" align="right">
						<div class="col-sm-3">
							<label class="control-label np">备注：</label>
						</div>
					</td>
					
					<td width="77%">
						<div class="form-group">
		    				<div class="col-sm-8">
		    					<textarea id="remarks" name="remarks" cols="20" rows="1" type="text" class="form-control" aria-required="true" placeholder="请输入备注" ></textarea>
		    				</div>
	    				</div>
					</td>		
				</tr>
			</table>
			<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8"  width="100%">
				<tr>
					<td width="100%" align="center">
						 <div class="ibox-content">
				              <button type="button" class="btn dpbtn_green" onclick="Updatesave();">确定</button>
				              <button type="button" class="btn dpbtn_red" onclick="Reset();">重置</button>
				          </div>
					</td>
				</tr>
			</table>
		</form>
	</div>
	<!-- public quote -->
    <%@include file="/jsp/comm_js_include.jsp"%>

 	<!-- custom js -->
    
    <script type="text/javascript"></script>
    
    <!--zTreeStyle.js-->
	<script type="text/javascript" src="${basePath}/js/zTreeStyle/jquery.ztree.core.js" charset="utf-8"></script>
	<script type="text/javascript" src="${basePath}/js/zTreeStyle/jquery.ztree.excheck.js" charset="utf-8"></script>
    
    <!--
    	作者：zhangpp
    	时间：2017-04-06
    	描述：js
    -->
    <script type="text/javascript">  
  		$(function(){
  			var parentId = $.getUrlData("parentId");
  			var parentName = $.getUrlData("parentName");
  			$('#parentId').val(parentId);
  			$('#parentName').val(parentName);
  			
  			var id = $.getUrlData("id");
  			$('#id').val(id);
  			
  			$.dpAjax({
	    		url:'${basePath}/power/getById',
    			data:{
    				"id":id,
    			},
    			success: function(datas){
    				  if(datas.flag == "100100")
					  {
    					   var result = datas.result;
    					   $('#id').val(result.replaceId);
    					   $('#name').val(result.name);
    					   $('#powerCode').val(result.powerCode);
    					   $('#remarks').val(result.remarks);
    					   $('#sortValue').val(result.sortValue);
		     			   $("#menuStatus").val(result.menuStatus); 
		     			   $("#href").val(result.href); 
		     			   $("#quick").val(result.quick);
		     			   $("#icon").val(result.icon);
						  return;
					  }
					  if(datas.flag == "100200")
	                  {
						  $.fn.showDatas({"datas":datas});
	                	  return;
	                  }
					  layer.msg(datas.message, {icon: 2});
                }
	    	});
  		});
  		
  		var parentNamecho = function() {
    				 var content = '<div class="ibox-content" style="height: 300px;border: 1px solid #F5F5F6; overflow:auto;overflow-x: hidden;">'
    					+ '	<div id="treeDemo" class="ztree">&nbsp;</div>'
     				+ '</div>'
     				+ '<div class="ibox-content">'
     				+ '	 <button class="btn dpbtn_green" type="button" onclick="confirmRole();">确定</button>'
     				+ '	 <button class="btn dpbtn_red" type="button" onclick="cancelRole();">取消</button>'
     				+ '</div>';
	     		
    		    	var UpdateIndex = layer.open({
    			    	  title:'菜单',
    			    	  type: 1,
    			    	  area: ['400px', '400px'], //宽高
    			    	  content: content
    			    });
     		    	var setting = {
     	 					check: {
     	 						enable: false
     	 					},
     	 					data: {
     	 						simpleData: {
     	 							enable: true
     	 						}
     	 					}
     	 			};
	    		  $.fn.zTree.init($("#treeDemo"), setting, parent.powerList);
	    		  
	    		 /*  var $as = $('a[title="' + $('#parentName').val() +'"]');
	    		  $as.addClass('curSelectedNode'); */
	    }
  		
  		var confirmRole = function()
	    {
	    	 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); 
	    	 var node=zTree.getSelectedNodes();
	    	 var treeNode = node[0];
	    	 if(treeNode.id == $.getUrlData("id")) {
	    		 layer.msg('父节点不能为本身',{icon:7});
				 return;
	    	 }
	    	 var parentNode = treeNode.getParentNode();
	    	 document.getElementById('parentName').value=treeNode.name;
	    	 document.getElementById('parentId').value=treeNode.id;
	    	 layer.closeAll(); 
	    }
		function cancelRole() {
			layer.closeAll();
		}  		
  		//重置
  		var Reset = function(){
			document.getElementById('name').value = "";
			document.getElementById('menuStatus').value = "1";
			document.getElementById('quick').value = "1";
			document.getElementById('powerCode').value = "";
			document.getElementById('href').value = "";
			document.getElementById('remarks').value = "";
			document.getElementById('sortValue').value = "";
			document.getElementById('icon').value = "";
		}
  		
  	    var Updatesave = function()
  		{
  			var validstatus = $("#commentForm").valid();

  	    	if(validstatus)
  	    	{
  	    		var data = $('#commentForm').serialize();
  	    		var quick = $('#quick').val();
				if(quick && quick == 1) {
					var href = $('#href').val();
					if(!href || href.trim() == ''){
						 layer.tips('链接地址不能为空','#href');
						 return;
					}
				}
  	    		layer.confirm('您确认要修改吗？', {
  		  			  btn: ['确定','取消'] //按钮
  				},function(){
  					layer.closeAll();
  					$.dpAjax({
      	 	    		url:'${basePath}/power/modify',
      	     			data:data,
      	     			success: function(datas){
      	     			  if(datas.flag == "100100")
      	 					  {
      	     				 	  layer.msg("修改成功！", {icon: 6});
      	     				 	  parent.layer.close(parent.updatelayer);
      	 						  return;
      	 					  }
      	 					  if(datas.flag == "100200")
      	 	                  {
      	 						  $.fn.showDatas({"datas":datas});
      	 	                	  return;
      	 	                  }
      	 					  layer.msg(datas.message, {icon: 2});
      	                 }
      	 	    	});
  					   					
  				});
  	    	}
  		} 
  	    
  	  $(function(){
			 $("#commentForm").validate({
			    rules: {
			    	sortValue: {
		            	zhengZS: true,
		            },
		        },
		        //重写showErrors
		        showErrors: function (errorMap, errorList) {
		            
		            $.each(errorList, function (i, v) {
		                layer.tips(v.message, v.element, { time: 1500 });
		                return false;
		            });  
		        },
		        /* 失去焦点时验证 */
		        onfocusout: function(element) { $(element).valid(); },
		        /*  键盘抬起不验证 */
		        onkeyup:false,
			 });
	 	})
    </script>
</body>
</html>
